import React from "react";
import {Text, TouchableOpacity, View} from "react-native";
import {listViewItemStyle} from "../style/listViewStyle";
import NavigatorBar from "../../navigator/NavigatorFactory";
import FriendListData from "../../../model/item/FriendListData";
import {globalStore} from "../../../libs/ShareStore";
import ChatUnRead from "../../utils/ChatUnRead";
import ChatAvatarImage from "../../utils/ChatAvatarImage";


type FriendListItemPropTypes = {
    avatar:string,
    name:string,
    body:string,
    unread:number,
    data:FriendListData,
}

type FriendListItemStateTypes = {

}

export default class FriendListItem extends React.Component<FriendListItemPropTypes, FriendListItemStateTypes> {
    constructor(props:FriendListItemPropTypes, context:any) {
        super(props, context);
    }

    componentDidMount(): void {
    }


    pressItem(){
        const category = 'friend';
        globalStore.selectChartContent(category, this.props.data, '');
        NavigatorBar.push('ChatWinPage',{category:category});
    }

    render() {
        return (
            <TouchableOpacity activeOpacity={1} onPress={() => this.pressItem()}>
                <View style={listViewItemStyle.container}>
                    <ChatAvatarImage  avatar={this.props.avatar} />
                    <View style={listViewItemStyle.content}>
                        <View style={listViewItemStyle.contentNameContainer}>
                            <View style={{flex:1}}><Text style={listViewItemStyle.contentName} numberOfLines={1}>{this.props.name}</Text></View>
                        </View>

                        <View style={listViewItemStyle.contentMessageContainer}>
                            <View style={{flex:1}}><Text style={listViewItemStyle.contentText} numberOfLines={1}>{(this.props.data.online === 0 ? '[离线]' : '[在线]') + this.props.data.sign}</Text></View>
                            <View style={{width:30}}><ChatUnRead style={listViewItemStyle.contentUnread} unread={parseInt(this.props.unread+"")} /></View>
                        </View>
                    </View>

                </View>
            </TouchableOpacity>
        );
    }
}
